body {
    main {
        background-color: #E8E8E8;
        padding         : 0px !important;

        .head {
            height          : 219px;
            background-color: #fff;
            padding-left    : 20px;
            margin-bottom   : 20px;
            padding-top     : 34px;

            .head-img {
                display    : flex;
                align-items: center;
                height     : 120px;

                .ibox {
                    width        : 120px;
                    height       : 120px;
                    border-radius: 60px;
                    margin-right : 15px;
                    border       : 3px solid rgba(66, 148, 255, 100);
                }

                .sportData-top {
                    margin-bottom: 0px;
                    height       : 100%;
                    line-height  : 120px;
                    color        : #333;
                    font-size    : 22px;
                    flex         : 1;

                }
            }

            p {
                margin-top: 20px;
            }
        }

        #upimg {
            display: none;
        }

        .sportData {
            display         : block;
            height          : 170px;
            background-color: #fff;

            .sportData-top {
                display        : flex;
                justify-content: space-between;
                padding        : 20px 24px 0 20px;
                font-size      : 18px;

                #right {
                    font-size: 24px;
                }
            }

            .sportData-btn {
                display      : flex;
                padding-left : 34px;
                padding-right: 37px;
                margin-top   : 20px;

                .sportTime {
                    flex: 1;

                    h6 {
                        font-size: 16px;
                    }

                    p {
                        margin-top: 15px;

                        span {
                            font-size: 40px;
                            color    : blue;
                        }
                    }
                }

                .expend {
                    flex        : 1;
                    border-left : 1px dashed #ccc;
                    padding-left: 10px;

                    h6 {
                        font-size: 16px;
                    }

                    p {
                        margin-top: 15px;

                        span {
                            font-size: 40px;
                            color    : blue;
                        }
                    }
                }
            }

        }

        .badge {
            display         : block;
            height          : 170px;
            background-color: #fff;
            margin-bottom   : 20px;
            margin-top      : 20px;

            .badge-top {
                display        : flex;
                justify-content: space-between;
                padding        : 20px 24px 0 20px;
                font-size      : 18px;

                i {
                    font-size: 24px;
                }
            }

            .badge-btn {
                display        : flex;
                justify-content: space-around;
                margin-top     : 15px;

                div {
                    width        : 100px;
                    height       : 100px;
                    border       : 1px solid #BBBBBB;
                    border-radius: 50px;
                }
            }
        }

        .back {
            height        : 150px;
            display       : flex;
            flex-direction: column;

            a {
                height          : 55px;
                text-align      : center;
                line-height     : 55px;
                background-color: #fff;
            }
        }
    }
}